<template>
  <el-card
    class="form-container"
    shadow="never"
  >
    <el-form
      :model="content"
      ref="contentFrom"
      :rules="rules"
      label-width="150px"
    >
      <el-form-item
        label="试卷名称："
        prop="name"
      >
        <el-input
          v-model="content.name"
          placeholder="请输入"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="通过分数："
        prop="passScore"
      >
        <el-input
          v-model="content.passScore"
          placeholder="请输入"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="试题："
        v-for="(item, index) in courseInfo.daysArray"
        :key="index"
      >
        <br>
        <el-card
          shadow="never"
          class="cardValue"
        >
          <el-form
            label-width="100px"
            v-for="(item,index) in content.questionList"
            :key="index"
          >
            <el-form-item
              label="序号："
              required
              class="item"
            >
              <el-input
                placeholder="请输入"
                v-model="item.seq "
              ></el-input>
            </el-form-item>
            <el-form-item
              label="本题分值："
              required
              class="item"
            >
              <el-input
                placeholder="请输入"
                v-model="item.score "
              ></el-input>
            </el-form-item>
            <el-form-item
              label="题干："
              required
              class="item"
            >
              <el-input
                placeholder="请输入"
                type="textarea"
                v-model="item.questionStem "
              ></el-input>
            </el-form-item>
            <!-- <div
              v-for="(item, index) in result.resultsArray"
              :key="index"
            > -->
            <div
              v-for="(item, index) in item.optionList"
              :key="index"
            >
              <el-form-item
                label="选项A："
                required
                class="item"
              >
                <el-input
                  placeholder="请输入"
                  v-model="item.optionValue "
                ></el-input>
              </el-form-item>
              <el-form-item
                label="选项B："
                required
                class="item"
              >
                <el-input
                  placeholder="请输入"
                  v-model="item.optionValue"
                ></el-input>
              </el-form-item>
            </div>
            <el-form-item>
              <el-button
                @click="addRes()"
                style="margin-top:10px"
              >+ 添加选项</el-button>
            </el-form-item>
            <el-form-item
              label="正确答案："
              required
            >
              <el-radio
                v-model="radio"
                label="1"
              >选项A</el-radio>
              <el-radio
                v-model="radio"
                label="2"
              >选项B</el-radio>
              <el-radio
                v-model="radio"
                label="3"
                v-if=" item.optionList.length>1"
              >选项C</el-radio>
              <el-radio
                v-model="radio"
                label="4"
                v-if=" item.optionList.length>2"
              >选项D</el-radio>
            </el-form-item>
          </el-form>
        </el-card>
        <div class="grid-content bg-purple">
          <el-button
            @click="addDays()"
            style="margin-top:10px"
          >添加试题</el-button>
        </div>
      </el-form-item>

      <el-form-item>
        <el-button
          type="primary"
          @click="onSubmit()"
        >确定</el-button>
        <el-button @click="back">取消</el-button>
      </el-form-item>
    </el-form>
  </el-card>
</template>

<script>
import SingleUpload from "@/components/Upload/singleUpload";
// import WEditor from 'wangeditor'
import { prptySave, deletePrpty } from "@/api/goodsMs";
import { examSave, getExamById } from "@/api/college";

import moment from "moment";
import { contentGetById, contentSave, contentUpdate } from "@/api/content";

const defaultContent = {
  createBy: "",
  createTime: "",
  name: "",
  passScore: "",
  questionList: [
    {
      answer: "",
      createBy: "",
      createTime: "",
      examId: "",
      optionList: [
        {
          createBy: "",
          createTime: "",
          optionCode: "",
          optionValue: "",
          questionId: "",
          seq: "",
          updateBy: "",
          updateTime: "",
        },
      ],
      questionStem: "",
      questionType: "",
      score: "",
      seq: "",
      updateBy: "",
      updateTime: "",
    },
  ],
  status: "",
  totalScore: "",
  trainingId: "",
  updateBy: "string",
  updateTime: "2020-10-22T06:40:06.095Z",
};
export default {
  // name: 'MenuDetail',
  components: { SingleUpload },
  props: {
    isEdit: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      radio: "1",
      list: [],
      prptyValue: "",
      addUms: false,
      courseInfo: { daysArray: [{}] },
      result: { resultsArray: [{}] },
      // result: { optionList: [{}] },
      // source: '销售属性',
      parentId: 0,
      content: Object.assign({}, defaultContent),
      rules: {
        name: [{ required: true, message: "请输入试卷名称", trigger: "blur" }],
        passScore: [
          { required: true, message: "请输入通过分数", trigger: "blur" },
        ],
      },
    };
  },
  created() {
    this.getList();
  },
  mounted() {
    // console.log(123, this.content)
    console.log(this.content.questionList.length);
  },
  methods: {
    change(value) {
      console.log(this.courseInfo.daysArray);
      // this.courseInfo.daysArray.push(value)
      this.list.push(value);
      console.log(5555, this.list.length);
      if (this.list.length == 1) {
        this.prptyValue = value;
      } else {
        this.prptyValue += ";";
        this.prptyValue += value;
      }

      console.log(123, this.prptyValue);
      this.content.questionList.map((item, index) => {
        item.optionList.map((item, index) => {
          console.log(item);
          item.optionValue = this.prptyValue;
        });
      });
      // this.content.prptyValList.map((item, index) => {
      //   item.prptyValue = this.prptyValue;
      // });
    },
    changeValue(value) {
      this.content.prptyType = value;
    },
    addDays() {
      this.courseInfo.daysArray.push({});
    },
    addRes() {
      this.result.resultsArray.push({});
      console.log(this.result.resultsArray.length);
    },
    onSubmit() {
      // this.content.content = this.editor.txt.html()
      this.$refs["contentFrom"].validate((valid) => {
        if (valid) {
          this.$confirm("是否提交数据", "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          }).then(() => {
            const params = {
              ...this.content,
            };
            console.log(params);
            examSave(this.content).then((response) => {
              this.$refs["contentFrom"].resetFields();
              this.resetForm("contentFrom");
              this.$message({
                message: "提交成功",
                type: "success",
                duration: 1000,
              });
              this.$router.back();
              // console.log(this.courseInfo)
            });
          });
        } else {
          this.$message({
            message: "验证失败",
            type: "error",
            duration: 1000,
          });
          return false;
        }
      });
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
      this.content = Object.assign({}, defaultContent);
    },
    back() {
      this.$router.go(-1);
    },
    getList() {
      const params = {
        examId: this.$route.query.id,
      };
      getExamById(params).then((response) => {
        this.content = response.data;
        console.log(response.data);
      });
    },
  },
};
</script>

<style scoped>
.form-container {
  position: relative;
  z-index: 0;
  width: 800px;
}
.item {
  margin-bottom: 20px;
}
</style>
